<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:p="http://primefaces.org/ui">

    <ui:composition template="/layout/adminTemplate.xhtml">

        <ui:define name="content">

            <p:panel header="Administración de Noticias" id="pnlAdminContenido">
                <h:form id="datos">
                    <p:growl id="messages"/>
                    <h:link outcome="/backend/FrmCrearNoticia.xhtml" value="crear"/>
                    <br/>
                   
                   
                    <h:panelGroup id="datosNoticias">
                        <p:dataGrid id="noticias" var="noticias" value="#{gestorNoticias.listaNoticias}" columns="1" style="width: 60%"  
                                    rows="12" paginator="true"  
                                    paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"  
                                    rowsPerPageTemplate="9,12,15">  

                            <p:panel header="#{noticias.nombre}" style="text-align:center; vertical-align: top;">  
                                <h:panelGrid columns="2" style=" text-align: justify" >  
                                    <p:graphicImage value="#{gestorNoticias.getImagen(noticias)}" alt="imagen" height="100px"/>   
                                    <h:outputText value="#{noticias.descripcion}" escape="false" />  
                                    <h:outputText value="#{noticias.fecha}" style="width: 400px; height: 400px"/>
                                    <h:outputText value="&nbsp;"/>
                                    <h:panelGrid columns="3">
                                        <p:commandButton id="cmdNuevo" title="Nueva" action="#{gestorNoticias.nuevaNoticia}" icon="ui-icon-document"  style="margin: 0px !important"/>
                                        <p:commandButton id="cmdModificar" title="Modificar" action="#{gestorNoticias.modificaNoticia(noticias)}" 
                                                         update=":datos:messages :datos:dialogo" oncomplete="dlg1.show();" icon="ui-icon-pencil"   
                                                         style="margin: 0px !important"/>
                                        <p:commandButton id="cmdEliminar" title="Eliminar" action="#{gestorNoticias.eliminarNoticia(noticias)}" update=":datos:messages :datos:noticias" icon="ui-icon-close"  style="margin: 0px !important">
                                            <p:confirm header="Eliminar noticia" message="Esta seguro?" icon="ui-icon-alert" />
                                        </p:commandButton>
                                        <p:confirmDialog global="true" showEffect="fade" hideEffect="explode">  
                                            <p:commandButton value="Si" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>  
                                            <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>       
                                        </p:confirmDialog> 
                                    </h:panelGrid>
                                    <p:accordionPanel activeIndex="-1"  style="width: 800px !important;">
                                        <p:ajax event="tabChange" listener="#{gestorNoticias.onTabChange}" update=":datos:messages coments"/> 
                                        <p:tab title="#{noticias.id}: Comentarios" id="tab" >
                                            <p:dataGrid value="#{gestorNoticias.listaComentarios}" style="width: 100%;" columns="1" var="comentario" id="coments">
                                                <p:panel style="width: 100%;" header="#{comentario.usuario.nombre} dijo:" >
                                                    <h:outputText value="#{comentario.contenido}" style="width: 100%;"/>
                                                    <br/>
                                                    <h:outputText value="#{comentario.estado==1?'REPORTADO':''}" style="color: red; font-size: 10pt;"/>
                                                    <br/>
                                                    <p:commandButton id="cmdEliminarComent" title="Eliminar" value="Eliminar Comentario" update="coments" action="#{gestorNoticias.borrarComentario(comentario)}" icon="ui-icon-close"  style="margin: 0px !important">
                                                        <p:confirm header="Eliminar noticia" message="Esta seguro?" icon="ui-icon-alert" />
                                                    </p:commandButton>
                                                    <p:confirmDialog global="true" showEffect="fade" hideEffect="explode">  
                                                        <p:commandButton value="Si" type="button" styleClass="ui-confirmdialog-yes" icon="ui-icon-check"/>  
                                                        <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" icon="ui-icon-close"/>       
                                                    </p:confirmDialog> 
                                                </p:panel>
                                            </p:dataGrid>
                                        </p:tab>
                                    </p:accordionPanel>
                                </h:panelGrid>  
                            </p:panel>  

                        </p:dataGrid>  
                    </h:panelGroup>
                    <p:dialog widgetVar="dlg1" id="dialogo">
                        <h:panelGrid columns="2">
                            <h:outputLabel for="nombre" value="Titulo:" />
                            <p:inputText id="nombre" value="#{gestorNoticias.noticiaSel.nombre}" style="width: 300px;" required="true" requiredMessage="El campo Título es obligatorio"/>

                            <h:outputLabel for="privacidad" value="Privacidad:"/>

                            <p:selectOneMenu id="privacidad" value="#{gestorNoticias.noticiaSel.privacidad}">
                                <f:selectItem itemLabel="Solo Escuela" itemValue="1" />  
                                <f:selectItem itemLabel="Facultad" itemValue="2" />  
                                <f:selectItem itemLabel="Abierto" itemValue="3" />     
                            </p:selectOneMenu>
                            <h:outputLabel for="tipo" value="Tipo:"/>
                            <p:selectOneMenu id="tipo" value="#{gestorNoticias.noticiaSel.tipo}">
                                <f:selectItem itemLabel="Noticia" itemValue="0" />  
                                <f:selectItem itemLabel="Tema" itemValue="1" />       
                            </p:selectOneMenu>


                        </h:panelGrid>
                        <br/>
                        <br/>
                        <h:outputLabel value="Contenido de la Noticia" style="font-size: 15pt;"/>
                        <br/>
                        <p:editor id="editor" width="800" value="#{gestorNoticias.noticiaSel.descripcion}"/>
                        <br/>  
                        <p:commandButton value="Guardar" action="#{gestorNoticias.modificarNoticia()}" update="messages :datos:noticias" oncomplete="dlg1.hide();"/>
                        <p:commandButton value="Cancelar" ajax="false"/>
                    </p:dialog>
                </h:form>
            </p:panel>
        </ui:define>
    </ui:composition>
</html>

